<!--
  ~ Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *      http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 -->
 
 
<div class="navigation-wrapper">
    <div class="node-item" *ngFor="let item of displayData" (click)="onClick($event, item)">
        <div class="node-data-wrapper" [ngClass]="{'selected': selectedItem && selectedItem === item[displayOptions.idProperty]}">
            <span class="node-data" [ngClass]="{'mark':item[displayOptions.valueProperty] === displayOptions.searchText}" [attr.data-tests-id]="item[displayOptions.valueProperty]">

                <span *ngIf="displayOptions.iconProperty" [ngClass]="['node-data-icon', item[displayOptions.iconProperty], 'small']"></span>
                {{item[displayOptions.valueProperty]}}
                <span class="sprite-new archive-label" *ngIf="item.originArchived"></span>
            </span>
        </div>
        <div class="children-node" *ngIf="item[displayOptions.childrenProperty]">
            <hierarchy-navigation class="children-hierarchy" [displayData]="item[displayOptions.childrenProperty]"
                                  [selectedItem]="selectedItem"
                                  [displayOptions]="displayOptions"
                                  (updateSelected)="onSelectedUpdate($event)"></hierarchy-navigation>
        </div>
    </div>
</div>
